.DayPickerInput {
  font-size: 14px;
  input {
    outline: none;
    border: none;
  }

  .DayPicker-Day {
    font-weight: normal;
    height: 30px;
    width: 30px;
  }

  .DayPicker-Day:not(.DayPicker-Day--disabled):not(.DayPicker-Day--outside) {
    &.DayPicker-Day--selected {
      border-radius: 0;
      color: inherit;
      background: transparentize($blue, 0.9);
    }

    &.DayPicker-Day--from {
      background: $blue;
      border-radius: 50% 0 0 50%;
      color: white;
    }

    &.DayPicker-Day--to {
      background: $blue;
      border-radius: 0 50% 50% 0;
      color: white;
    }

    &.DayPicker-Day--to.DayPicker-Day--from {
      border-radius: 50%;
    }
  }
}

.DayPickerInput-OverlayWrapper {
  top: $space-s;
}

.DayPickerInput-Overlay {
  box-shadow: $box-shadow;
  left: auto;
  right: 0;
}

.DayPicker-Footer {
  text-align: center;
}

.DayPicker-TodayButton {
  @extend .menu-bar-button;
  font-family: $body-font;
  margin: 0 auto;
  padding: 3px 6px;
}
